<template>
	<view class="myData">
		<view class="explain">以下为必填资料 填写完善才能申请借款</view>
		<view class="list">
			<view class="list_item"  v-for="(item,index) in list"  @click='listItemClick(item.pages)' :key="index">
				<view class="list_item_card">
					<image class="list_item_image" style="width: 60rpx;height: 60rpx;" mode="scaleToFill" :src="item.src"></image>
					<view class="list_item_information">
						<view class="title">{{item.title}}</view>
						<view class="notes">{{item.notes}}</view>
					</view>
					<text class="text" :class="item.isFill==0?'':'active'">{{item.isFill==0?'未填写':'已填写'}}</text>
				</view>
			</view>
		</view>
		<view class="explain">以下为必填资料 填写完善才能申请借款</view>
		<view class="list">
			<view class="list_item"  v-for="(item,index) in list1"  @click='listItemClick(item.pages)' :key="index">
				<view class="list_item_card">
					<image class="list_item_image" style="width: 60rpx;height: 60rpx;" mode="scaleToFill" :src="item.src"></image>
					<view class="list_item_information">
						<view class="title">{{item.title}}</view>
						<view class="notes">{{item.notes}}</view>
					</view>
					<text class="text" :class="item.isFill==0?'':'active'">{{item.isFill==0?'未填写':'已填写'}}</text>
				</view>
			</view>
		</view>
		<button class="borrowingBt" @click="applyHandel">立即借款</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[
					{
						src:'../../static/img/g_03.png',
						title:'身份信息',
						notes:'*让我们了解您的资料信息',
						pages:'../my/Identity',
						isFill:1 //0未填写，1已填写
					},
					{
						src:'../../static/img/g_08.png',
						title:'资料信息',
						notes:'*让我们了解你的基本情况',
						pages:'../loan/profile',
						isFill:0 //0未填写，1已填写
					},
					{
						src:'../../static/img/g_14.png',
						title:'收款银行卡',
						notes:'*会将钱打到该卡内',
						pages:'../my/bankCard',
						isFill:0 //0未填写，1已填写
					}
				],
				list1:[
					{
						src:'../../static/img/g_10.png',
						title:'芝麻信用',
						notes:'*测评您的信用资质',
						pages:'../my/sesameCredit',
						isFill:0 //0未填写，1已填写
					}
				]
			};
		},
		methods:{
			//详情页跳转
			listItemClick(url){
				console.log(url)
				uni.redirectTo({
				    url: url
				});
			},
			//立即借款
			applyHandel(){
				console.log('立即借款')
			}
		}
	}
</script>

<style lang="scss">
	.myData{
		.explain{
			height: 88rpx;
			line-height: 88rpx;
			font-size: 28rpx;
			background-color: rgba(238, 238, 238, 1);
			text-align: center;
			border: 1px solid rgba(255, 255, 255, 0);
		}
		.list{
			padding:0 30rpx;
			box-sizing: border-box;
			border-top:1px solid #DEDEDE ;
			border-bottom:1px solid #DEDEDE ;
			.list_item{
				height: 152rpx;	
				border-bottom: 1px solid #DEDEDE;
				background-image: url(../../static/img/right.png);
				background-repeat: no-repeat;
				background-size: 15rpx;
				background-position: right;
				.list_item_card{
					position: relative;
					top: 50%;
					transform: translateY(-50%);
					.text{
						position: absolute;
						top: 15rpx;
						right:40rpx;
						color: rgba(132, 132, 132, 1);
						font-size: 30rpx;
					}
					.active{
						color: #39C2CC;
					}
				}
				.list_item_information{
					display: inline-block;
					margin-left: 20rpx;
					.title{
						line-height: 32rpx;
						color: rgba(16, 16, 16, 1);
						font-size: 32rpx;
						text-align: left;
					}
					.notes{
						margin-top: 10rpx;
						line-height: 32rpx;
						color: rgba(132, 132, 132, 1);
						font-size: 26rpx;
						text-align: left;
					}
				}
			}
			.list_item:last-child{
				border-bottom-width: 0;
			}
		}
		.borrowingBt{
			margin: 42rpx 24rpx 0 24rpx;
			background-color: #ED7D6B;
			color: #FFFFFF;
		}
	}
</style>
